<!--
 * @Author: your name
 * @Date: 2021-06-01 10:30:24
 * @LastEditTime: 2021-06-06 21:56:21
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \遵义报名\zunyi\src\views\details\details.vue
-->
<template>
  <div class="examDetails">
    <!-- 导航条 -->
    <nav-bar></nav-bar>

    <!-- 内容区 -->
    <el-row type="flex" class="row-bg container">
      <el-col :span="8">
        <p>考试时间：{{ detailsData.emtm }}</p>

        <p>主办单位：{{ detailsData.ogze }}</p>

        <p>考试名称：{{ detailsData.name }}</p>

        <p>考试期数：{{ detailsData.podl }}</p>
      </el-col>

      <el-col :span="8">
        <p>证书名称：{{ detailsData.ccnm }}</p>

        <p>考试费：{{ detailsData.cost }}</p>

        <p>报名开始：{{ detailsData.star }}</p>

        <p>报名截止：{{ detailsData.ddle }}</p>
      </el-col>

      <el-col :span="8">
        <p>成绩时间：{{ detailsData.gdtm }}</p>

        <p>准考证时间：{{ detailsData.attm }}</p>

        <p>报名上限：{{ detailsData.tplt }}</p>
      </el-col>
    </el-row>
    <div class="container">
      <div class="container-item">
        <span class="container-item-title">考试描述：</span>
        <div v-html="detailsData.dsib"></div>
      </div>

      <div class="container-item">
        <span class="container-item-title">毕业证样本：</span>
        <el-image
          style="width: 600px; height: 500px"
          :src="detailsData.dmsp"
        ></el-image>
      </div>

      <div class="container-item">
        <span class="container-item-title">考纲说明：</span>
        <el-image
          style="width: 600px; height: 500px"
          :src="detailsData.epan"
        ></el-image>
      </div>
    </div>
  </div>
</template>

<script>
import { getExam } from "api/examList.js";
export default {
  props: {
    id: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      detailsData: {}, //详情页对象
    };
  },
  methods: {
    API_getExam(id) {
      //获取考试详情数据
      return this.$httpRequest({
        url: getExam,
        method: "POST",
        data: {
          param: {
            id,
          },
        },
      });
    },
  },
  async created() {
    let res = await this.API_getExam(this.id);
    this.detailsData = res.data.data;
  },
};
</script>


<style lang="scss" scoped>
.examDetails {
    .container{
        p{
            font-size:20px;
            padding: 10px;
        }
        .container-item{
            padding: 10px;
            .container-item-title{
                font-size: 20px;
                font-weight: bold;
                display: block;
            }
        }
    }
}
</style>